﻿/*
*slider 0.1
*Copyright (c) 2009 AtHome
*Date:2012-10-25
*滚动条操作文档
*/
/*---------------------------------------*/
(function ($) {
    $.fn.slider32 = function (options) {
        var defaults = {
            orientation: "horizontal", //滚动条方向
            target: null, //被操控的jq对象
            adjust: false, //是否整理滚动条
            header: {
                className: "",
                fn: function () { }
            },
            ender: {
                className: "",
                fn: function () { }
            },
            backer: {
                className: "",
                fn: function () { }
            },
            hander: {
                className: "",
                fn: function () { }
            }
        }
        var options = $.extend({}, defaults, options);
        return this.each(function () {
            var JQself = $(this);
            var JQheader = $('<div class="header32"></div>');
            var JQender = $('<div class="ender32"></div>');
            var JQbacker = $('<div class="backer32"></div>');
            var JQhander = $('<div class="hander32"></div>');
            var JQtarget; //文档对象
            var JQtargetSon; //文档对象的被控对象
            var uiSlider = {
                header: JQheader,
                ender: JQender,
                backer: JQbacker,
                hander: JQhander
            };
            /*---------------------------------------如果是整理滚动条*/
            if (options.adjust) {
                var JQheader = JQself.find(".header32");
                var JQender = JQself.find(".ender32");
                var JQbacker = JQself.find(".backer32");
                var JQhander = JQself.find(".hander32");
            }
            /*---------------------------------------如果是创建滚动条*/
            else if (!options.adjust) {
                JQself.append(JQheader).append(JQender).append(JQbacker);
                JQhander.appendTo(JQbacker);

                JQtarget = options.target; //取得文档对象
                if (JQtarget.find(".targetSon32").length == 0) {
                    var JQTemp = $('<div class="targetSon32_out" style=" width:100%; height:100%; position:relative; overflow:hidden;"><div class="targetSon32" style=" position:absolute;"><div class="targetSon32_in" style=" width:100%; height:100%; position:relative;"></div></div></div>');

                    JQtarget.children().appendTo(JQTemp.find(".targetSon32_in"));
                    JQTemp.appendTo(JQtarget);
                }
                JQtargetSon = JQtarget.find(".targetSon32"); //取得文档对象的被控对象

                if (options.orientation == "horizontal") {
                    JQhander.draggable({
                        containment: 'parent',
                        orientation: options.orientation,
                        drag: function (eDrag, uiDrag) {
                            var a = JQbacker.width() - JQhander.width(); //手柄的可动距离
                            var b = JQtargetSon.width() - JQtarget.width(); //文档的可动距离
                            var aa = parseInt(JQhander.css("left").toString().match(/^([0-9]+)px$/)[1]); //手柄已偏移了的距离
                            JQtargetSon.css({
                                "left": -aa / a * b
                            });
                        }
                    });
                } else if (options.orientation == "vertical") {
                    JQhander.draggable({
                        containment: 'parent',
                        orientation: options.orientation,
                        drag: function (eDrag, uiDrag) {
                            var a = JQbacker.height() - JQhander.height(); //手柄的可动距离
                            var b = JQtargetSon.height() - JQtarget.height(); //文档的可动距离
                            var aa = parseInt(JQhander.css("top").toString().match(/^([0-9]+)px$/)[1]); //手柄已偏移了的距离
                            JQtargetSon.css({
                                "top": -aa / a * b
                            });
                        }
                    });
                }

            }
            /*---------------------------------------加入样式*/
            if (options.header.className) {
                JQheader.addClass(options.header.className);
            }
            if (options.ender.className) {
                JQender.addClass(options.ender.className);
            }
            if (options.backer.className) {
                JQbacker.addClass(options.backer.className);
            }
            if (options.hander.className) {
                JQhander.addClass(options.hander.className);
            }
            /*---------------------------------------如果是是水平滚动条*/
            if (JQself.hasClass("horizontal32") || options.orientation == "horizontal") {
                JQself.addClass("horizontal32");
                JQheader.height(JQheader.parent().height());
                JQender.height(JQender.parent().height()).followParent32({
                    top: 0,
                    right: 0
                });
                JQbacker.followParent32({
                    cutWidth: (JQheader.width() + JQender.width()),
                    top: 0,
                    left: JQheader.width()
                });
                JQhander.followParent32({
                    top: 0
                });
                JQhander.width(JQtarget.width() / JQtargetSon.width() * JQbacker.width()); //设置手柄的长度
            }
            /*---------------------------------------如果是是垂直滚动条*/
            else if (JQself.hasClass("vertical32") || options.orientation == "vertical") {
                JQself.addClass("vertical32");
                JQheader.width(JQheader.parent().width());
                JQender.followParent32({
                    left: 0,
                    bottom: 0
                });
                JQbacker.followParent32({
                    cutHeight: JQheader.height() + JQender.height(),
                    left: 0,
                    top: JQheader.height()
                });
                JQhander.followParent32({
                    width: JQhander.parent().height(),
                    left: 0
                });
                JQhander.height(JQtarget.height() / JQtargetSon.height() * JQbacker.height()); //设置手柄的长度
            }

            /*---------------------------------------执行小部件的方法*/
            if (options.header.fn) {
                options.header.fn(uiSlider);
            }
            if (options.ender.fn) {
                options.ender.fn(uiSlider);
            }
            if (options.backer.fn) {
                options.backer.fn(uiSlider);
            }
            if (options.hander.fn) {
                options.hander.fn(uiSlider);
            }
        });
    }
})(jQuery);
